<template>
    <div class="comfirm">
        <pui-dialog :maskClick="false" :title="props.title" v-model="componentRef.dialogVisible" animate="fade" :width="props.width" @onCancel="closeDialog" @onSubmit="submitHandle">
            <template #content>
                <div>
                    {{ props.tip }}
                </div>
            </template>
        </pui-dialog>
    </div>
</template>
<script lang="ts">
import { defineComponent } from 'vue'
export default defineComponent({
    name: 'Comfirm'
})
</script>
<script lang="ts" setup>
import { reactive, getCurrentInstance, watch } from 'vue'
import { deviceManager } from '@/services/phot_client/device'
const { proxy } = getCurrentInstance() as any
const props = defineProps({
    title: {
        type: String,
        default: '关闭提示'
    },
    animate: {
        type: String,
        default: 'fade'
    },
    tip: {
        type: String,
        default: '是否确认此操作？'
    },
    width: {
        type: String,
        default: '400px'
    }
})
const emit = defineEmits({
    onClose: (val: any) => {},
    onSubmit: (val: any) => {}
})
const componentRef = reactive({
    dialogVisible: false,
})
const init = () => {
    componentRef.dialogVisible = true
}
const closeDialog = () => {
    componentRef.dialogVisible = false
    emit('onClose', '关闭')
}
const submitHandle = () => {
    emit('onSubmit', '提交')
}

defineExpose({
    init
})
</script>